<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%
    String path =request.getContextPath();
%>

<link rel="stylesheet" type="text/css" href="<%=path%>/static/css/zTreeStyle/zTreeStyle.css">
<script type="text/javascript" src="<%=path%>/static/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery.ztree.all.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery.ztree.excheck.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery.ztree.exedit.js"></script>
<script type="text/javascript" src="<%=path%>/static/js/jquery.ztree.exhide.js"></script>
<html>
<head>
    <title>My first Spring boot web demo</title>
</head>
<body>

<div style="background:#fffff0">

    <h2>Hello ${name}</h2>
    <img src="<%=path%>/static/images/nodata.png">
    <div>你好啊！！！！！！！！！！！！！！！！</div>
    <ul id="regionZTree" class="ztree"></ul>
    <input type="hidden" id="list" name="list" value="${pageBean.list}"/>
    <div>
        <div>
            <table border="2px">
                <thead>
                <tr>
                    <th>姓名</th>
                    <th>邮箱</th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${pageBean.list}" var="user" varStatus="vs">
                    <tr>
                        <td style="width:400px;">${user.username}</td>
                        <td>${user.email}</td>
                    </tr>
                </c:forEach>
                </tbody>
            </table>
        </div>
        <div>
            <table border="1px">
                <tr>
                    <%-- 构建分页导航 --%>
                    共有${pageBean.totalRecord}个员工，共${pageBean.totalPage }页，当前为${pageBean.pageNum}页
                    <br/>
                    <td >
                        <a href="${pageContext.request.contextPath}/test/name?pageNum=1">首页</a></td>
                    <%--如果当前页为第一页时，就没有上一页这个超链接显示 --%>
                    <c:if test="${pageBean.pageNum ==1}">
                        <c:forEach begin="${pageBean.start}" end="${pageBean.end}" step="1" var="i">
                            <c:if test="${pageBean.pageNum == i}">
                                <td style="width: 60px;text-align: center">${i}</td>
                            </c:if>
                            <c:if test="${pageBean.pageNum != i}">
                                <td><a href="${pageContext.request.contextPath}/test/name?pageNum=${i}">${i}</a></td>
                            </c:if>
                        </c:forEach>
                        <td> <a href="${pageContext.request.contextPath}/test/name?pageNum=${pageBean.pageNum+1}">下一页</a></td>
                    </c:if>

                    <%--如果当前页不是第一页也不是最后一页，则有上一页和下一页这个超链接显示 --%>
                    <c:if test="${pageBean.pageNum > 1 && pageBean.pageNum <pageBean.totalPage}">
                        <td> <a href="${pageContext.request.contextPath}/test/name?pageNum=${pageBean.pageNum-1}">上一页</a></td>
                        <c:forEach begin="${pageBean.start}" end="${pageBean.end}" step="1" var="i">
                            <c:if test="${pageBean.pageNum == i}">
                                <td style="width: 60px;text-align: center">${i}</td>
                            </c:if>
                            <c:if test="${pageBean.pageNum != i}">
                                <td> <a href="${pageContext.request.contextPath}/test/name?pageNum=${i}">${i}</a></td>
                            </c:if>
                        </c:forEach>
                        <td> <a href="${pageContext.request.contextPath}/test/name?pageNum=${pageBean.pageNum+1}">下一页</a></td>
                    </c:if>

                    <%-- 如果当前页是最后一页，则只有上一页这个超链接显示，下一页没有 --%>
                    <c:if test="${pageBean.pageNum == pageBean.totalPage}">
                        <td><a href="${pageContext.request.contextPath}/test/name?pageNum=${pageBean.pageNum-1}">上一页</a></td>
                        <c:forEach begin="${pageBean.start}" end="${pageBean.end}" step="1" var="i">
                            <c:if test="${pageBean.pageNum == i}">
                                <td style="width: 60px;text-align: center">${i}</td>
                            </c:if>
                            <c:if test="${pageBean.pageNum != i}">
                                <td><a href="${pageContext.request.contextPath}/test/name?pageNum=${i}">${i}</a></td>
                            </c:if>
                        </c:forEach>
                    </c:if>
                    <%--尾页 --%>
                    <td><a href="${pageContext.request.contextPath}/test/name?pageNum=${pageBean.totalPage}">尾页</a></td>
                    <td><select name = "pageNum"  onchange = "submit(this);">
                        <c:forEach begin="${pageBean.start}" end="${pageBean.end}" step="1" var="i">
                            <option value ="${i}" <c:if test="${pageBean.pageNum == i}">selected</c:if>>第${i}页</option>
                        </c:forEach>
                    </select>
                    </td>
                    <td><input type = "text" size = 4 name = "pageNum" id="pageNum" value = ""/><input type = "button" onclick="go();" size = 4 value = "go"/></td>
                </tr>
            </table>
        </div>
    </div>
</div>
<shrio:hasPermission name="admin"><input type="button" value="跳转页面" onclick="add();"/></shrio:hasPermission>
</body>
<script type="text/javascript">

    //跳转页面
    function add(){
        window.location.href="<%=path%>/user/add";
    }
    //输入页数
    function go() {
        var pageNum=$("#pageNum").val();
        if (pageNum==''){
            alert("请输入页数");
        } else {
            window.location.href="/test/name?pageNum="+pageNum;
        }
    }
    //点击下拉框查询页数
    function submit(data) {
        window.location.href="/test/name?pageNum="+data.value;
    }
    var setting = {
        view: {
            showIcon: true,  //设置是否显示节点图标
            dblClickExpand: false,//双击节点时，是否自动展开父节点的标识
            showLine: true,//是否显示节点之间的连线
            fontCss:{'color':'black','font-weight':'bold'},//字体样式函数
            selectedMulti: true //设置是否允许同时选中多个节点
        },
        check:{
            //chkboxType: { "Y": "ps", "N": "ps" },
            chkboxType: { "Y": "", "N": "" },
            chkStyle: "checkbox",//复选框类型
            enable: true //每个节点上是否显示 CheckBox
        },
        edit:{
            addHoverDom:addHoverDom,
            removeHoverDom:removeHoverDom,
            enable: true,
            editNameSelectAll: true,
            showRemoveBtn : true,
            showRenameBtn : true,
            removeTitle : "remove",
            renameTitle : "rename"
        },
        data: {
            simpleData: {//简单数据模式
                enable:true,
                idKey: "id",
                pIdKey: "IPARENTID",
                rootPId: null
            }
        },
        callback: {
            onClick: zTreeOnClick,// 用于捕获父节点展开之前的事件回调函数，并且根据返回值确定是否允许展开操作
        }
    };
    var nodes=eval(${nodes});
    var functionList= [{"id":"11","pId":"11","name":"信息采集"},{"id":"5","pId":"5","name":"信息查询","checked":true},{"id":"12","pId":"11","name":"村居信息采集"},{"id":"6","pId":"5","name":"村居信息查询","checked":true},{"id":"32","pId":"31","name":"用户管理"},{"id":"26","pId":"26","name":"统计分析"},{"id":"13","pId":"11","name":"农户信息采集"},{"id":"7","pId":"5","name":"农户信息查询","checked":true},{"id":"28","pId":"26","name":"村居信息统计"},{"id":"33","pId":"31","name":"角色管理"},{"id":"31","pId":"31","name":"平台管理"},{"id":"34","pId":"31","name":"权限管理"},{"id":"35","pId":"31","name":"单位管理"},{"id":"30","pId":"26","name":"农户家庭基本信息统计"},{"id":"29","pId":"26","name":"农户家庭成员信息统计"},{"id":"27","pId":"26","name":"农户家庭教育信息统计"},{"id":"37","pId":"31","name":"数据字典"},{"id":"38","pId":"26","name":"需求情况信息统计"},{"id":"40","pId":"26","name":"农户医疗情况统计"},{"id":"39","pId":"26","name":"农户水住行情况统计"}];
    zTreeObj = $.fn.zTree.init($("#regionZTree"), setting, nodes);
    function zTreeOnClick(event, treeId, treeNode) {

        alert(treeNode.tId + ", " + treeNode.name+","+event);
    };

    //增加新增按钮
    function addHoverDom(treeId,treeNode){
        debugger;
        var sObj = $("#" + treeNode.tId + "_span");
        if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
        var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
            + "' title='添加子节点' onfocus='this.blur();'></span>";
        sObj.after(addStr);
        var btn = $("#addBtn_"+treeNode.tId);
        if (btn) btn.bind("click", function(){
            var zTree = $.fn.zTree.getZTreeObj("regionZTree");
            var newnade={id:(100 + newCount),name:"new node" + (newCount++)};
            zTree.addNodes(treeNode,newnade);

            $.ajax({
                url:'tree.json',
                type: "get",
                dataType: "json",
                success:function(data){
                    data.push(JSON.parse(newnade));
                    console.log(JSON.stringify(data));
//alert(data[0].children[0].children[0].id);
                }
            });
            return false;
        });

    }

    function removeHoverDom(treeId, treeNode) {
        $("#addBtn_"+treeNode.tId).unbind().remove();
    };
</script>
</html>